<template>
    <div>
        <!-- 显示 store user 模块下面的 token -->
        <!-- $store.state 用来获取状态, 写死不能变 
    后面加上模块名.数据字段名即可-->
        {{ token }}
        {{ appName }} <br />
        <button @click="addToken">token +1</button>
    </div>
</template>

<script>
    // 原本的 mapMutations 是全局命名空间的, 不能再用
    import { mapGetters, createNamespacedHelpers } from "vuex";
    // createNamespacedHelpers('user') 根据 user 命名空间, 自动生成帮助函数
    const { mapMutations } = createNamespacedHelpers("user");
    export default {
        computed: {
            ...mapGetters(["token", "appName"]),
        },
        methods: {
            ...mapMutations(["addToken"]),
            // addToken() {
            //   this.$store.commit('user/addToken')
            // }
        },
    };
</script>

<style>
</style>